<template>
  <div >
    <div class="toolbar">

    <el-button @click="preview">预览</el-button>
    <el-button @click="save">保存</el-button>
    <el-button @click="clearCanvas">清空画布</el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: "Toolbar",

  methods:{
    // 预览
    preview(){

    },
    // 保存
    save(){

    },
    // 清空
    clearCanvas(){
      this.$store.commit('setCurComponent', { component: null, index: null })
      this.$store.commit('setComponentData', [])
      this.$store.commit('recordSnapshot')
    },
  }
}
</script>

<style lang="scss" scoped>
.toolbar{
  height: 64px;
  border-bottom: #ddd 1px solid;
  overflow-x: auto;
  line-height: 64px;
  text-align: left;
  padding: 0 20px;
}
</style>
